function Cup(ctx){
	this.width = 100;
	this.height = 60;
	this.left = gameMonitor.w/2 - this.width/2;
	this.top = gameMonitor.h - 2*this.height;
	this.player = gameMonitor.im.createImage('static/img/player.png');
	this.paint = function(){
		ctx.drawImage(this.player, this.left, this.top, this.width, this.height);
	}
	//鼠标移动函数
	this.setPosition = function(event){
		if(gameMonitor.isMobile()){
			var tarL = event.changedTouches[0].clientX;
			//var tarT = event.changedTouches[0].clientY;
		}
		else{
			var tarL = event.offsetX;
			//var tarT = event.offsetY;
		}
		this.left = tarL - this.width/2 - 16;
		//this.top = tarT - this.height/2;
		if(this.left<0){
			this.left = 0;
		}
		if(this.left>320-this.width){
			this.left = 320-this.width;
		}
		/*if(this.top<0){
			this.top = 0;
		}
		if(this.top>gameMonitor.h - this.height){
			this.top = gameMonitor.h - this.height;
		}*/
		this.paint();
	}

	this.controll = function(){
		var _this = this;
		var stage = $('#gamepanel');
		var currentX = this.left,
			//currentY = this.top,
			move = false;
		stage.on(gameMonitor.eventType.start, function(event){
			_this.setPosition(event);
			move = true;
		}).on(gameMonitor.eventType.end, function(){
			move = false;
		}).on(gameMonitor.eventType.move, function(event){
			event.preventDefault();
			if(move){
				_this.setPosition(event);	
			}
		});
	}

	this.eat = function(rainlist){
		for(var i=rainlist.length-1; i>=0; i--){
			var r = rainlist[i];
			if(r){
				var l1 = this.top+this.height/2 - (r.top+r.height/2);
				var l2 = this.left+this.width/2 - (r.left+r.width/2);
				var l3 = Math.sqrt(l1*l1 + l2*l2);
				if(l3<=this.height/2 + r.height/2){
					rainlist[r.id] = null;
					if(r.type==0){
						gameMonitor.stop();
						$('#gameoverPanel').show();
						setTimeout(function(){
							$('#gameoverPanel').hide();
							$('#resultPanel').show();
							gameMonitor.getScore();
						}, 2000);
					}
					else{
						$('#score').text(++gameMonitor.score);
						setTimeout(function() {
						}, 200);
					}
				}
			}
		}
	}
}

//雨滴下落函数
function Rain(type, left, id){
	this.speedUpTime = 300;
	this.id = id;
	this.type = type;
	this.width = 50;
	this.height = 50;
	this.left = left;
	this.top = -50;
	this.speed = 0.04 * Math.pow(1.2, Math.floor(gameMonitor.time/this.speedUpTime));
	this.loop = 0;
//选择雨滴，多个雨滴无法一步实现
	var p = this.type == 0 ? 'static/img/rain4.png' : ('static/img/rain3.png'||'static/img/rain2.png'||'static/img/rain3.png');
	this.pic = gameMonitor.im.createImage(p);
}
Rain.prototype.paint = function(ctx){
	ctx.drawImage(this.pic, this.left, this.top, this.width, this.height);
}
Rain.prototype.move = function(ctx){
	if(gameMonitor.time % this.speedUpTime == 0){
		this.speed *= 1.2;
	}
	this.top += ++this.loop * this.speed;
	if(this.top>gameMonitor.h){
	 	gameMonitor.rainlist[this.id] = null;
	}
	else{
		this.paint(ctx);
	}
}
function ImageMonitor(){
	var imgArray = [];
	return {
		createImage : function(src){
			return typeof imgArray[src] != 'undefined' ? imgArray[src] : (imgArray[src] = new Image(), imgArray[src].src = src, imgArray[src])
		},
	}
}
var gameMonitor = {
	w : 320,
	h : 568,
	bgWidth : 320,
	bgHeight : 568,
	time : 0,
	timmer : null,
	bgSpeed : 2,
	bgloop : 0,
	score : 0,
	im : new ImageMonitor(),
	rainlist : [],
	bgDistance : 0,//背景位置
	eventType : {
		start : 'touchstart',
		move : 'touchmove',
		end : 'touchend'
	},
	init : function(){
		var _this = this;
		var canvas = document.getElementById('stage');
		var ctx = canvas.getContext('2d');
		//绘制背景
		var bg = new Image();
		_this.bg = bg;
		bg.onload = function(){
          	ctx.drawImage(bg, 0, 0, _this.bgWidth, _this.bgHeight);          	
		}
		bg.src = 'static/img/bg.jpg';
		_this.initListener(ctx);
	},
	initListener : function(ctx){
		var _this = this;
		var body = $(document.body);
		$(document).on(gameMonitor.eventType.move, function(event){
			event.preventDefault();
		});
		body.on(gameMonitor.eventType.start, '.replay, .playagain', function(){
			$('#resultPanel').hide();
			var canvas = document.getElementById('stage');
			var ctx = canvas.getContext('2d');
			_this.cup = new Cup(ctx);
      		_this.cup.controll();
      		_this.reset();
			_this.run(ctx);
		});
		body.on(gameMonitor.eventType.start, '#frontpage', function(){
			$('#frontpage').css('left', '-100%');
		});
		body.on(gameMonitor.eventType.start, '#guidePanel', function(){
			$(this).hide();
			_this.cup = new Cup(ctx);
			_this.cup.paint();
      		_this.cup.controll();
			gameMonitor.run(ctx);
		});
	},
//背景图片向下滚动
	rollBg : function(ctx){
		ctx.drawImage(this.bg, 0, this.bgDistance, this.bgWidth, this.bgHeight);
	},
	run : function(ctx){
		var _this = gameMonitor;
		ctx.clearRect(0, 0, _this.bgWidth, _this.bgHeight);
		_this.rollBg(ctx);
		//绘制杯子
		_this.cup.paint();
		_this.cup.eat(_this.rainlist);
		//产生雨滴
		_this.genorateRain();
		//绘制雨滴
		for(i=_this.rainlist.length-1; i>=0; i--){
			var r = _this.rainlist[i];
			if(r){
				r.paint(ctx);
				r.move(ctx);
			}
		}
		_this.timmer = setTimeout(function(){
			gameMonitor.run(ctx);
		}, Math.round(1000/60));
		_this.time++;
	},
	stop : function(){
		var _this = this
		$('#stage').off(gameMonitor.eventType.start + ' ' +gameMonitor.eventType.move);
		setTimeout(function(){
			clearTimeout(_this.timmer);
		}, 0);
	},
	genorateRain : function(){
		var genRate = 30; //产生雨滴的频率
		var random = Math.random();
		if(random*genRate>genRate-1){
			var left = Math.random()*(this.w - 50);
			var type = Math.floor(left)%2 == 0 ? 0 : 1;
			var id = this.rainlist.length;
			var r = new Rain(type, left, id);
			this.rainlist.push(r);
		}
	},
	reset : function(){
		this.rainlist = [];
		this.score = 0;
		$('#score').text(this.score);
	},
	//得分显示
	getScore : function(){
		var score = this.score;
		if(score==0){
			$('#scorecontent').html('真遗憾<br><span class="lighttext">没有</span>接到小水滴唷<br>⊂((・x・))⊃');
			return;
		}
		else if(score<15){
			$('#scorecontent').html('只接到了<span id="sscore" class="lighttext">21341</span>个小水滴<br>再努把力哦<br>(￣^￣)ゞ');
		
			$('#sscore').text(score);
		}
		else if(score>15 && score<=30){
			$('#scorecontent').html('接到了<span id="sscore" class="lighttext">21341</span>个小水滴<br>有半杯啦！！<br>:D');
		
			$('#sscore').text(score);
		}
		else if(score>30 && score<=45){
			$('#scorecontent').html('接到了<span id="sscore" class="lighttext">21341</span>个小水滴<br>你离成为小仙女只差一步了哦<br>(●°u°●)​ 」');
		
			$('#sscore').text(score);
		}		
		else{
		$('#scorecontent').html('接到了<span id="sscore" class="lighttext">21341</span>个小水滴<br>可以变成喝露水的小仙女啦<br>给你亲亲抱抱举高高～<br>//(・ω・)ノ');
		
		$('#sscore').text(score);
		}
	},
	//设备显示
	isMobile : function(){
		var sUserAgent= navigator.userAgent.toLowerCase(),
		bIsIphoneOs= sUserAgent.match(/iphone os/i) == "iphone os",
		bIsUc7= sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4",		
		bIsAndroid= sUserAgent.match(/android/i) == "android",
		bIsCE= sUserAgent.match(/windows ce/i) == "windows ce",
		bIsWM= sUserAgent.match(/windows mobile/i) == "windows mobile",
		bIsWebview = sUserAgent.match(/webview/i) == "webview";
		return ( bIsIphoneOs || bIsUc7 || bIsAndroid || bIsCE || bIsWM);
     }
}
if(!gameMonitor.isMobile()){
	gameMonitor.eventType.start = 'mousedown';
	gameMonitor.eventType.move = 'mousemove';
	gameMonitor.eventType.end = 'mouseup';
}
gameMonitor.init();
